<template>
    <div class="serviceFooter-wrap">
<!--        <el-row :gutter="20">
            <el-col :span="6">预约维修服务</el-col>
            <el-col :span="6">7天无理由退货</el-col>
            <el-col :span="6">15天免费换货</el-col>
            <el-col :span="6">满150元包邮</el-col>
        </el-row>-->

        <el-row type="flex" class="serviceFooter-row" justify="space-around">
            <el-col :span="6">
                <el-link type="info" :underline="false"><i class="el-icon-s-tools"></i>预约维修服务</el-link>
            </el-col>
            <el-col :span="6">
                <el-link type="info" :underline="false"><i class="el-icon-phone-outline"></i>7天无理由退货</el-link>
            </el-col>
            <el-col :span="6">
                <el-link type="info" :underline="false"><i class="el-icon-s-goods"></i>15天免费换货</el-link>
            </el-col>
            <el-col :span="6">
                <el-link type="info" :underline="false"><i class="el-icon-s-promotion"></i>满150元包邮</el-link>
            </el-col>
        </el-row>
    </div>

</template>

<script>
    export default {
        name: "ServiceFooter"
    }
</script>

<style scoped>
    .serviceFooter-wrap{
        overflow: hidden;
        display: flex;
        justify-content: center;
        width: 100%;
        height: 90px;
        line-height: 90px;
        background-color: #f7f7f7;
    }
    .el-col{
        display: flex;
        justify-content: center;
    }
    .el-col a{
        font-size: 18px;
    }
    .el-col i{
        margin-right: 5px;
    }
    .serviceFooter-row{
        width: 70%;
    }
    @media (max-width: 1000px){
        .serviceFooter-row{
            width: 100%;
        }
    }
</style>